<template>
	<div class="orderinformation">
	<header class="header">
		<div class="back">
			<i class="el-icon-erp-shangyiye" @click="back"></i>
			<p>订单详情</p>
		</div>
		<div class="addressinformation">
			<div class="icon">
				<i class="el-icon-erp-weizhi-yuan"></i>
			</div>
			<div class="address">
				<p><span>{{orderinformation.userName}}</span><span class="phone">{{orderinformation.phoneNo}}</span></p>
				<p class="pickgoods">取货地址</p>
				<p>{{orderinformation.detailAddress}}</p>
			</div>
		</div>
	</header>
</div>
</template>

<script>
 export default {
 	name:'orderinformation',
 	props:{
 		orderinformation:{
 			type:Object,
 			default: '' 
 		}
 	},
 	data () {
 		return {
 			
 		}
 	},
 	mounted () {
 		
 	},
 	methods:{
 		//返回上一页
			back () {
				this.$router.go(-1)
			}
 	}
 }
</script>

<style lang="less" scoped>
    .orderinformation{
    	width:100%;
    	.header{
    		width:100%;
    		.back{
    			position: fixed;
    			width:100%;
    			top:0;
    			left: 0;
    			display: flex;
    			width:100%;
    			margin-bottom: 20px;
    			background: #FFFFFF; 
    			height: 80px;      			 			
    			i{   
    				width:60px;
    				font-size: 40px;
    				font-weight: 700;
    				line-height: 90px;   				
    			}
    			p{
    				flex: 1;
    				text-align: center;
    				font-size: 30px;
    				line-height: 80px;
    			}
    		}
    		.addressinformation{
    			padding:20px 15px;
    			background: #FFFFFF;
    			margin-bottom: 20px;
    			justify-content: center; 
                align-items: center;
                display: -webkit-flex;
    			.icon{
    				width:60px;
    				text-align: center;
    				i{  
    					background: #FFFFFF; 
    					font-size: 60px;
    					color: #FF0000;   					
    				}
    			}
    			.address{
    				flex: 1;
    				margin-left: 20px;
    				.phone{
    					margin-left: 20px;
    				}
    				.pickgoods{
    					margin-bottom: 10px;   					
    				}
    			}
    		}
    	}
    }
</style>